<template>
  <div class="main">
    <div class="table">
      <div class="title">消费记录</div>
      <table>
        <tr style="background: #D2E9FF;color:#1890FF">
          <td>消费项目</td>
          <td>消费金额</td>
          <td>消费时间</td>
          <td>备注</td>
        </tr>
        <tr v-for="(item,index) in 8" :key="index">
          <td>语文</td>
          <td>123</td>
          <td>2025.04.05——00:20:12</td>
          <td>2</td>
        </tr>
      </table>
    </div>
  </div>
</template>
<script>
import { community } from "@/api/apiData";
export default {
  data() {
    return {};
  },
  mounted() {},
};
</script>
<style lang="less" scoped>
.main {
  padding: 22px 213px 213px;
  .table {
    border-radius: 8px;
    background: white;
    padding-bottom: 30px;
    .title {
      background: linear-gradient(to right, #56abf9, #5686fc);
    }
    table {
      width: 80%;
      margin: 29px auto;
      border-collapse: collapse;
      font-size: 24px;
      text-align: center;
      border-color: white;
      tr {
        background: #fff;
      }
      td{
        padding: 5px 0;
        font-size: 24px;
        line-height: 40px;
        height: 40px;
      }
      tr:nth-child(odd) {
        background: #F5FAFF;
      }
    }
  }
}
</style>